/* 
 @description: 后台首页

 @author: 韦淇霰

 @update: 2021年9月1日14:55:35 
 */
*{
    margin: 0;
    padding: 0;
}
body{
    width: 1903px;
    height: 100%;
}
ul{
    list-style-type: none;
}
// 鼠标经过效果

#head{
    width: 100%;
    height: 60px;
    position: relative;
    position:fixed;
    z-index: 10;
    background-color: #111111;
    color: #B8B8B8;
    a{
        color: #B8B8B8;
        text-decoration: none;
       
    }
    .yh{
        margin-top: 20px;
        color: rgb(250, 120, 120);
    }
    .logo{
        background-image: url('../../../other/Admin_image/logo1.png');
        background-size: 100% 100%;
        width: 220px;
        height: 100%;
        float: left;
        h1{
            margin:10px 0 10px 30px;
            &:hover{
                color: white;
            }
        }
    }
    .left_open{
        width: 50px;
        height: 100%;
        float: left;
        margin-left: 10px;
        .tb{
           width: 35px;
           margin:10px 0;
           height: 35px;
           background-color: rgb(54, 51, 51);
           border-radius: 3px;
           cursor: pointer;
           &:hover{
                color: white;
            }
           .fa{
               font-size: 25px;
               margin: 5px 5px 5px 6px;
           }
        }
    }
    .left_nav{
        width: 70px;
        height: 100%;
        margin-left: 50px;
        float: left;
        cursor: pointer;
        &:hover{
            color: white;
        }
        li{
            margin: 15px 0;
        } 
        
    }
    .right_nav{
        width: 238px;
        height: 100%;
        float: right;
        text-align:center; 
        .admin_person{
            width: 109px;
            height: 100%;
            float: left;
            &:hover{
                color: white;
            }
            &:hover .nav_tow_menu{
                color: white;
                display: block;
            }
            .control{
                margin: 15px 13px;
                font-size: 16px;
                cursor: pointer;
                margin-top: 18px;
            }
            .nav_tow_menu{
                width: 100px;
                height: 30px;
                margin-top: 6px;
                box-shadow:1px 1px 4px 1px rgb(172, 168, 168); 
                display: none;
                position: absolute;
                li{
                    line-height: 30px;
                    &:hover {
                        background-color: rgb(73, 75, 69);
                    }
                    &:hover a{
                        color: white;
                        cursor: pointer;
                    }
                 
                }
            }
        }
        .web_index{
            width: 90px;
            height: 100%;
            margin-left: 20px;
            float: left;
            cursor: pointer;
           
            .control{
                margin: 18px 0;
                &:hover a{
                    color: white;
                }
            }
           
        }
    }
}
#main{
    width: 100%;
    height: 1500px;
    color: #B8B8B8;
    overflow: hidden;
    position: relative;
    clear: both;
    a{
        text-decoration: none;
    }
    .left_menu{
        width: 220px;
        height: 100%;
        float: left;
        position: fixed;
        top: 60px;
        background-color: #222324;
        .a_menu{
            width: 220px;
            height: 432px;
            .d{
                display: inline-block;
                width: 216px;
                line-height: 30px;
                border-left: 4px solid rgb(34, 35, 36);
                transition: background-color 0.3s ease 0s;
                &:hover{
                    border-left: 4px solid rgb(72, 235, 235);
                    background-color: rgb(20, 19, 19);
                }
                a{
                    padding: 12px 15px 12px 20px;
                    display: block;
                    cursor: pointer;
                    color: rgb(142, 142, 142);
                    transition: background-color 0.3s ease 0s;
                    &:hover{
                        color: white;
                       
                    }
                    .fa-chevron-right{
                        text-indent: 2em;
                    }
                }
               .b_menu{
                   width: 200px;
                   height: 50px;
                   margin-left: 16px;
                   display: none;
                   li{
                       display: inline-block;
                       width: 107%;
                       margin-left: -15px;
                       height: 50px;
                       &:hover{
                            background-color: rgb(72, 235, 235);
                            border: none;
                       }
                       a{
                           display: inline-block;
                           width: 73%;
                           height: 52%;
                           margin-left: 23px;
                           font-size: 14px;
                           
                       }
                   }
               }
            }
        }
    }  
    .content_area{
        width: 1683px;
        // width: 100%;
        height: 1500px;
        float: left;
        position: absolute;
        top: 60px;
        right: 0;
        background-color: rgb(253, 253, 253);
        .mbx{
            width: 1643px;
            height: 50px;
            margin: 30px auto;
            overflow: hidden;
            box-shadow: 3px 5px 30px 5px rgb(223, 221, 221),3px 5px 30px 5px rgb(229, 236, 229);
            // background-color: rgb(214, 213, 213);
            p{
                margin: 15px auto;
                color: black;
                margin-left: 5px;
                .fa{
                    cursor: pointer;
                }
                a{
                    color: rgb(88, 88, 90);
                }
                span{
                    color: rgb(107, 107, 235);
                    cursor: pointer;
                }
            }
        }
        .show_login{
            width: 1643px;
            height: 50px;
            margin: 30px auto;
            overflow: hidden;
            border-left: 4px solid red;
            background-color: rgb(214, 213, 213);
            span{
                width: 500px;
                height: 20px;
                display: block;
                margin: 15px 10px;
                color: white;
            }
            .yh,#nowTime{
                color: rgb(111, 155, 236);
            }
            

        }
      
        .census{
            width: 1643px;
            height: 197px;
            margin: 30px auto;
            overflow: hidden;
            border:1px solid ;
            legend{
                margin-left: 20px;
                padding: 0 10px;
                font-size: 20px;
                font-weight: bold;
                color:rgb(92, 92, 92);
            }
            .fl{
                width:1500px;
                height: 100px;
                margin: 20px auto;
                display: flex;
                justify-content:space-between;
                li{
                    width: 350px;
                    height: 120px;
                    overflow: hidden;
                    background-color: rgb(218, 214, 214);
                    .gl{
                        display: block;
                        width: 100px;
                        height: 20px;
                        color: white;
                        font-weight: bold;
                        margin:20px 0px 10px 35px;
                    }
                    .sl{
                        display: block;
                        width: 100px;
                        height: 20px;
                        color: white;
                        margin:30px 0px 10px 35px;
                        font-size: 25px;
                        color: rgb(94, 94, 240);
                    }
                    &:hover{
                        opacity: 0.4;
                        background-color: rgb(12, 11, 11);
                    }
                    
                }
            }
        }
    }
}
